.about{
      display: block;
      height:auto;
      background-color: lightgray;
      padding: 30px;
    }

    .about-box{
      border-bottom: 2px solid;
      border-color: rgb(163, 161, 161);
      padding-bottom: 20px;


    }
    .about-title{
      display: inline-block;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 30px;
      color: rgb(51, 50, 50);
      padding-left: 50px;
      margin: 0 auto;                 /* Center horizontally */
      margin-top: 20px;
      overflow-wrap: break-word; /* Ensure long words wrap */
      word-wrap: break-word;     /* Older browser support */
      max-width: 800px;              /* Limit width on large screens */
      width: 90%;                    /* Responsive width */
      white-space: normal;
    }
     @media (max-width: 600px) {
    .about-title {
      padding: 0; /* Remove padding on small screens */
      align-items: center;
    }
  }
    .experience{
      display: flex;             /* Use flexbox for centering */
      justify-content: center;   /* Horizontal center */
      align-items: center;       /* Vertical center */   
      margin-top: 30px;
      margin-bottom: 30px;
      overflow-wrap: break-word; /* Ensure long words wrap */
      word-wrap: break-word;     /* Older browser support */
    }
    .experince-box{
      text-align: center;  
    }
    .experience-title{
      text-align: center;
      font-size: 40px;
      margin-bottom: 0px;
    }
    .about-experience{
      width: 400px;
      line-height: 2;
      text-align: center;
      font-size: 22px;
    }
    .experience-info{
      font-size: 25px;
      font-weight: bold;
      padding-right: -50px;
    }
    .about-experience-conclusion{
      font-size: 23px;
      border-top: 2px solid;
      border-color: rgb(163, 161, 161);
    }
    .about-experience-imperial{
      font-size: 23px;
      
      border-bottom: 2px solid;
      border-color: rgb(163, 161, 161);

    }
    .archcon-format{
      font-size: 38px;
     

    }
    a:link {
    color: lightgray;       /* Normal link */
    text-decoration: none;
}

a:visited {
    color: purple;     /* Visited link */
}

a:hover {
    color: blue;        /* Mouse hover */
    text-decoration: underline;
}

a:active {
    color: orange;     /* While clicking */
}

/* Override link color inside a specific container */
.my-container a {
    color: green !important; /* Force green text for links in this container */
}